


import { memo, forwardRef, useImperativeHandle, useEffect, useState, useRef } from 'react'
import { message } from 'antd'
import LdPrintTable from '../../../../../components/LdPrintTable';
import { paperSizeOptions, printTypeOptions, colorOptions, secretOptions } from "../../../../../utils/constant";
import doc from "../../../../../assets/file-icon/doc.png";
import pdf from "../../../../../assets/file-icon/pdf.png";
import xsl from "../../../../../assets/file-icon/xsl.png";
import ppt from "../../../../../assets/file-icon/ppt.png";
import txt from "../../../../../assets/file-icon/txt.png";
import rtf from "../../../../../assets/file-icon/rtf.png";
import tiff from "../../../../../assets/file-icon/tiff.png";
import jpg from "../../../../../assets/file-icon/jpg.png";
import png from "../../../../../assets/file-icon/png.png";
import { getSizeView } from '../../../../../utils/index'
import bus from '../../../../../utils/eventBus';
import LdDrawer from '../../../../../components/LdDrawer'
import './index.scss'
const FILETYPE = {
    doc,
    pdf,
    xsl,
    ppt,
    txt,
    rtf,
    tiff,
    jpg,
    png,
}
const CloneLogView = forwardRef((props: any, ref: any) => {
    const { onClose, detailRow,title="刻录日志详情" } = props
    const docInfo = useRef([
        { label: "密级", value: "机密", model: "fileLevel", fn: secretOptions },
        { label: "页数", value: "103", model: "page" },
        { label: "方式", value: "单面", model: "printLayer", fn: printTypeOptions },
        { label: "纸张", value: "A4", model: "pageSize", fn: paperSizeOptions },
        { label: "色彩", value: "黑白", model: "printColor", fn: colorOptions },
    ])
    const pageConfig = useRef({
        total: 0,
        currentPage: 1,
        pageSize: 10
    })
    const columns = useRef([
        { key: 'identifyPart', dataIndex: 'identifyPart', title: "标识",ellipsis:true },
        { key: 'oper', dataIndex: "oper", title: '回收人', width: 100 },
        { key: 'pageNum', dataIndex: 'pageNum', title: '页数', width: 80 },
        { key: 'createTime', dataIndex: 'createTime', title: '生成时间' },
        {
            key: 'fileStatus',
            dataIndex: 'fileStatus',
            title: '状态',
            width: 120,
            render: (_: any, record: any) => {
                return (
                    <>{record.fileStatus === 1 ? "使用中" : record.fileStatus === 2 ? "全部" : "已回收"}</>
                )
            }
        }

    ])
    const [data, setData] = useState<any[]>([])
    const loadFileIcon = () => {
        if (!detailRow.fileType) {
            return doc;
        }
        const fileType = detailRow.fileType.toLocaleLowerCase();
        if (FILETYPE.hasOwnProperty(fileType)) {
            return (FILETYPE as any)[fileType];
        } else {
            return doc;
        }
    }
    const loadData = () => {
        const payload = {
            ...pageConfig.current,
            identifyPart: detailRow.identify,
            type: 1,
        };
        window.chromePro.getCarrierLogDetail(JSON.stringify(payload));
    }
    const getCarrierLogDetailFinished = (res: any) => {
        if (res.code === 200) {
            setData(res.data.logDetail)
            pageConfig.current = { ...pageConfig.current, total: res.total }
        } else {
            message.error(res.message || "获取数据失败!");
        }
    }
    const handlePage = (page: any) => {
        pageConfig.current = { ...pageConfig.current, ...page }
        loadData()
    }

    useEffect(() => {
        if (detailRow && detailRow.identify) {
            loadData();
            docInfo.current.forEach((item) => {
                if (item.model === 'fileSize') {
                    item.value = getSizeView(detailRow[item.model])
                } else if (item.model === 'fileTypeLabel') {
                    item.value = detailRow['printColor'] === 1 ? 'CD' : 'DVD'
                }
            });
        }
        bus.addListener("getCarrierLogDetailFinished", getCarrierLogDetailFinished);
    }, [])
    useEffect(() => {
        return () => {
            bus.removeListener("getCarrierLogDetailFinished", getCarrierLogDetailFinished);
        }
    }, [])
    return (
        <>
            <LdDrawer onClose={onClose} title={title}>
                <div className="h100">
                    <div className="file-info flex-start align-center">
                        <img draggable={false} src={loadFileIcon()} alt="" style={{ width: '72px', height: '72px' }} />
                        <div className="h100 ml-17 flex-between flex-column">
                            <div>
                                <h6 className="file-title">{detailRow.fileTitle}</h6>
                                <p className="file-time">{detailRow.fileCreateTime}</p>
                            </div>
                            <div className="paper-info">
                                {docInfo.current.map((item: any, index: any) => {
                                    return (
                                        <div key={index} className="p-item">
                                            <span style={{ marginRight: '3px' }}>{item.label}: </span>
                                            <span style={{ color: '#333' }}>{
                                                item.value
                                            }</span>
                                        </div>
                                    )
                                })}
                            </div>
                        </div>
                    </div>
                    <div className="table-content">
                        <LdPrintTable pageConfig={pageConfig.current} rowSelection={false} handlePage={handlePage} data={data} columns={columns.current}></LdPrintTable>
                    </div>
                </div>
            </LdDrawer>
        </>
    )
})
export default memo(CloneLogView)